/<template>
  <div class="static">
    <div class="head">
      <van-icon name="qr" />
      <b>首页</b>
    </div>
    <div class="main">
      <p class="btns">
        <van-button :type="item.type" v-for="(item, index) in btnArr" :key="index">{{item.con}}</van-button>
      </p>
      <div class="user">
         <p>{{infocontent.username}}</p>
         <p>{{infocontent.password}}</p>
      </div>
    </div>
    
  </div>
</template>

<script>
export default {
     data() {
    return {
      btnArr:[
          {type:"primary",con:"Components"},
          {type:"info",con:"Chats"},
          {type:"default",con:"Excel"},
          {type:"warning",con:"Table"},
          {type:"danger",con:"Form"},
          {type:"info",con:"Theme"},
      ],
      infocontent:{}
    };
  },
  created() {
      this.infocontent=JSON.parse(window.localStorage.getItem("info"))
      console.log(this.infocontent);

  },
};
</script>

<style lang="scss" scoped>
.static{
    width: 100%;
  height: 100%;
  .head{
      width: 100%;
  line-height: 50px;
  }
  .user{
      width: 200px;
      height: 200px;
      margin: 10px;
      display: flex;
    align-items: center;
    flex-direction: column;
    justify-content: space-evenly;
    background: #f0f0f0;
  }
}
.btns{
    width: 100%;
    height: 50PX;
    display: flex;
    align-items: center;
    justify-content: space-around;
}
</style>